/*
Copyright (c) 2019 Uber Technologies, Inc.
SPDX-License-Identifier: Apache-2.0
*/

.HopsSelector--Selector {
  color: var(--text-muted);
  margin: 0 0.5em;
  padding: 0px 3px;
}

.HopsSelector--Selector--decrement,
.HopsSelector--Selector--increment {
  background-color: #f4f4f4;
  border: none;
  cursor: pointer;
  height: 27px;
  padding: 0em 0.3em 0.3em;
  width: 27px;
}

.HopsSelector--Selector--decrement {
  margin-right: 0.75em;
}

.HopsSelector--Selector--increment {
  margin-left: 0.75em;
}

.HopsSelector--Selector--decrement:disabled,
.HopsSelector--Selector--increment:disabled {
  color: #bbb;
}

.HopsSelector--Selector--btn {
  background: transparent;
  border: none;
  color: #096dd9;
  cursor: pointer;
  font-weight: bold;
  margin: 0 0.2em;
  padding: 1px 2px;
}

.HopsSelector--Selector--btn.is-Empty {
  color: #aaa;
  font-weight: 400;
}

.HopsSelector--Selector--btn.is-Partial {
  color: #d46b08;
}

/* .HopsSelector--Selector > .HopsSelector--Selector--furthest {
  margin-left: 0.3em;
} */

.HopsSelector--Selector > .HopsSelector--Selector--delimiter {
  color: #999;
  font-weight: 400;
}

.HopsSelector--Selector--slash {
  color: #999;
}

.HopsSelector--Selector--AscIcon {
  margin-right: 0.3em;
}

.HopsSelector--Selector--AscIcon.is-Up {
  transform: scaleY(-1);
}

.HopsSelector--Selector--ChevronDown {
  color: #999;
  height: 0.7em;
  padding-bottom: 0.15em;
  width: 0.7em;
}

.HopsSelector--Selector--ChevronRight {
  color: #999;
  height: 0.7em;
  padding-bottom: 0.15em;
  width: 0.7em;
}

.HopsSelector--Selector--ChevronRight.is-Empty {
  color: #ccc;
}
